<!DOCTYPE html>
<html>
<head>
<?php include_once VIEWS.'inc/head.php'; ?>
<?php
	echo static_file('web/css/jquery.mCustomScrollbar.css');
	echo static_file('web/js/jquery.lazyload.min.js');
	echo static_file('web/js/jquery.mCustomScrollbar.js');
	echo static_file('web/css/swiper-3.3.1.min.css');
	echo static_file('web/js/swiper-3.3.1.min.js');
?>

</head>

<body>
	<div class="main">
		<?php include_once VIEWS.'inc/header.php'; ?>
		<section class="sales">
			<div class="abanner">
				<img src="<?php echo static_file('web/img/gbanner.jpg')?>" alt="">
			</div>

			<div class="sales_box w1440">
				<div class="title wow fadeInUp">
					<div class="cn">服务管家</div>
					<div class="en">Service housekeeper</div>
				</div>
				<div class="service_list">
					<div class="swiper_service">
						<div class="swiper-container">
							<div class="swiper-wrapper">
								<div class="swiper-slide">
									<a href="<?php echo site_url('service/network'); ?>">
										<div class="ico">
											<img src="<?php echo static_file('web/img/ico1.png')?>" alt="">
										</div>
										<div class="txt">服务网点</div>
										<div class="more">立即查询 <i></i></div>
									</a>		
								</div>

								<div class="swiper-slide">
									<a href="<?php echo site_url('service/revision'); ?>">
										<div class="ico">
											<img src="<?php echo static_file('web/img/ico2.png')?>" alt="">
										</div>
										<div class="txt">网上报修</div>
										<div class="more">立即查询 <i></i></div>
									</a>
								</div>
								<div class="swiper-slide">
									<a href="<?php echo site_url('service/installation'); ?>">
										<div class="ico">
											<img src="<?php echo static_file('web/img/ico3.png')?>" alt="">
										</div>
										<div class="txt">预约安装</div>
										<div class="more">立即查询 <i></i></div>
									</a>		
								</div>

								<div class="swiper-slide">
									<a href="http://www.baidu.com" target="_blank">
										<div class="ico">
											<img src="<?php echo static_file('web/img/ico2.png')?>" alt="">
										</div>
										<div class="txt">用户社区</div>
										<div class="more">立即查询 <i></i></div>
									</a>
								</div>
							</div>
							<div class="swiper-pagination"></div>
						</div>
					</div>
					<ul class="f-cb">
						<li class="wow fadeInUp" data-wow-delay="0s">
							<a href="<?php echo site_url('service/network'); ?>">
								<div class="tab">
									<div class="tab_cell">
										<div class="ico">
											<img src="<?php echo static_file('web/img/ico1.png')?>" alt="">
											<img src="<?php echo static_file('web/img/ico5.png')?>" alt="" class="active">
										</div>
										<div class="txt">服务网点</div>
										<div class="more">立即查询 <i></i></div>
									</div>
								</div>
							</a>					
						</li>
						<li class="wow fadeInUp" data-wow-delay="0.2s">
							<a href="<?php echo site_url('service/revision'); ?>">
								<div class="tab">
									<div class="tab_cell">
										<div class="ico">
											<img src="<?php echo static_file('web/img/ico2.png')?>" alt="">
											<img src="<?php echo static_file('web/img/ico6.png')?>" alt="" class="active">
										</div>
										<div class="txt">网上报修</div>
										<div class="more">立即查询 <i></i></div>
									</div>
								</div>
							</a>
						</li>
						<li class="wow fadeInUp" data-wow-delay="0.4s">
							<a href="<?php echo site_url('service/installation'); ?>">
								<div class="tab">
									<div class="tab_cell">
										<div class="ico">
											<img src="<?php echo static_file('web/img/ico3.png')?>" alt="">
											<img src="<?php echo static_file('web/img/ico7.png')?>" alt="" class="active">
										</div>
										<div class="txt">预约安装</div>
										<div class="more">立即查询 <i></i></div>
									</div>
								</div>
							</a>
						</li>
						<li class="wow fadeInUp" data-wow-delay="0.6s">
							<a  href="http://www.baidu.com" target="_blank">
								<div class="tab">
									<div class="tab_cell">
										<div class="ico">
											<img src="<?php echo static_file('web/img/ico4.png')?>" alt="">
											<img src="<?php echo static_file('web/img/ico8.png')?>" alt="" class="active">
										</div>
										<div class="txt">用户社区</div>
										<div class="more">立即查询 <i></i></div>
									</div>
								</div>
							</a>
						</li>
					</ul>

				</div>

				<div class="problem_box f-cb">
					<div class="problem_l wow fadeInUp">
						<div class="t"><a href="<?php echo site_url('service/problem'); ?>">常见问题</a></div>
						<div class="list">
							<ul>
								<li class="active">
									<div class="ti">
										<div class="tab">
											<div class="tab_cell">泉达管线机使用注意事项</div>
										</div>
									</div>
									<div class="con show">
										<div class="con_b">
											<p>（1）因为水压不稳定或自来水压力过大，使得热水器中的热水下不来； </p>
											<p>（2）冷水压力过大，将热水顶回热水器。首先观察热水阀门的开关是否没有开大，或把冷水阀门关小，若还是不行则可增加供水泵来加大热水出水水压，或是把热水器出水管加粗； </p>
											<p>（3）若冬季出现此现象，可能是室外管路被冻住，需要检查电伴热带是否启动或者失效； </p>
											<p>（4）检查水温水位传感器及其线路是否完好。</p>
										</div>
										
									</div>
								</li>
								<li>
									<div class="ti">
										<div class="tab">
											<div class="tab_cell">
												天气晴好时地热能热水器水温不热
											</div>
										</div>
									</div>
									<div class="con">
										<div class="con_b">
											<p>（1）因为水压不稳定或自来水压力过大，使得热水器中的热水下不来； </p>
											<p>（2）冷水压力过大，将热水顶回热水器。首先观察热水阀门的开关是否没有开大，或把冷水阀门关小，若还是不行则可增加供水泵来加大热水出水水压，或是把热水器出水管加粗； </p>
											<p>（3）若冬季出现此现象，可能是室外管路被冻住，需要检查电伴热带是否启动或者失效； </p>
											<p>（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。</p>
										</div>
									</div>
								</li>
								<li>
									<div class="ti">
										<div class="tab">
											<div class="tab_cell">
												反渗透净水机使用注意事项
											</div>
										</div>
									</div>
									<div class="con">
										<div class="con_b">
											<p>（1）因为水压不稳定或自来水压力过大，使得热水器中的热水下不来； </p>
											<p>（2）冷水压力过大，将热水顶回热水器。首先观察热水阀门的开关是否没有开大，或把冷水阀门关小，若还是不行则可增加供水泵来加大热水出水水压，或是把热水器出水管加粗； </p>
											<p>（3）若冬季出现此现象，可能是室外管路被冻住，需要检查电伴热带是否启动或者失效； </p>
											<p>（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。</p>
										</div>
									</div>
								</li>
								<li>
									<div class="ti">
										<div class="tab">
											<div class="tab_cell">
												地热能热水器水温在洗浴过程中不稳定，时冷时热，导致热水浪费在调节水温上
											</div>
										</div>
									</div>
									<div class="con">
										<div class="con_b">
											<p>（1）因为水压不稳定或自来水压力过大，使得热水器中的热水下不来； </p>
											<p>（2）冷水压力过大，将热水顶回热水器。首先观察热水阀门的开关是否没有开大，或把冷水阀门关小，若还是不行则可增加供水泵来加大热水出水水压，或是把热水器出水管加粗； </p>
											<p>（3）若冬季出现此现象，可能是室外管路被冻住，需要检查电伴热带是否启动或者失效； </p>
											<p>（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。（4）检查水温水位传感器及其线路是否完好。</p>
										</div>
									</div>
								</li>
							</ul>
						</div>
					</div>
					<div class="links wow fadeInUp"  data-wow-delay="0.2s">
						<ul>
							<li style="background:url(<?php echo static_file('web/img/bg1.jpg')?>) no-repeat center center;background-size:cover">
								<a href="<?php echo site_url('service/handbook'); ?>">
									<div class="tit">
										<div class="cn">使用手册</div>
										<div class="en">Handbook</div>
										<div class="ico">
											<img src="<?php echo static_file('web/img/btn.png')?>" alt="">
										</div>
									</div>
								</a>
							</li>
							<li  style="background:url(<?php echo static_file('web/img/bg2.jpg')?>) no-repeat center center;background-size:cover">
								<a href="<?php echo site_url('service/charge'); ?>">
									<div class="tit">
										<div class="cn">收费标准</div>
										<div class="en">Charge standard</div>
										<div class="ico">
											<img src="<?php echo static_file('web/img/222.png')?>" alt="">
										</div>
									</div>
								</a>
							</li>
						</ul>
					</div>
				</div>

				<div class="proposal f-cb wow fadeInUp">  
					<a class="pic" style="background:url(<?php echo static_file('web/img/proposal1.jpg')?>) no-repeat center center;background-size:cover;" href="<?php echo site_url('service/proposal'); ?>">
						<div class="cont">
							<div class="t">投诉建议</div>
							<div class="con">
								您对四季沐歌的意见或建议
							</div>
							<div class="more">立即查询 <i></i></div>
						</div>
					</a>
					<div class="form_box">
						<div class="tab">
							<div class="tab_cell">
								<div class="t">帮助中心</div>
								<form action="">
									<select name="" id="">
										<option value="请选择你想了解的类别">请选择你想了解的类别</option>
									</select>
									<input type="submit" value="搜 索" class="submit">
								</form>
								
							</div>
						</div>
					</div>
				</div>

				<div class="box wow fadeInUp">
					<ul class="f-cb">
						<li>
							<a href="<?php echo site_url('service/after'); ?>">
								<div class="pic">
									<img src="<?php echo static_file('web/img/ser1.jpg')?>" alt="">
								</div>
								<div class="cont">
									<div class="t">售后服务规范</div>
									<div class="more">立即了解我们的售后服务规范 <i></i></div>
								</div>
							</a>
						</li>
						<li>
							<a href="<?php echo site_url('service/policy'); ?>">
								<div class="pic">
									<img src="<?php echo static_file('web/img/ser2.jpg')?>" alt="">
								</div>
								<div class="cont">
									<div class="t">保修政策</div>
									<div class="more">立即了解我们的保修政策 <i></i></div>
								</div>
							</a>
						</li>
						<li>
							<a href="<?php echo site_url('service/safety'); ?>">
								<div class="pic">
									<img src="<?php echo static_file('web/img/ser3.jpg')?>" alt="">
								</div>
								<div class="cont">
									<div class="t">安全施工规范</div>
									<div class="more">查看更多安全施工规范 <i></i></div>
								</div>
							</a>
						</li>
					</ul>
				</div>
			</div>
		</section>
    	<?php include_once VIEWS.'inc/footer.php'; ?>
	</div>
	<script>
		$(function(){
			$('header .bocweb-nav ul li').eq(5).addClass('active');
			$('.service_list ul li').height(Math.floor($('.service_list ul li').width()*(370/338)));
			$(window).resize(function(){
				$('.service_list ul li').height(Math.floor($('.service_list ul li').width()*(370/338)));
			})

			var mySwiper = new Swiper ('.swiper_service .swiper-container', {
				pagination: '.swiper_service .swiper-pagination',
				slidesPerView : 3,
				spaceBetween : 20,
				breakpoints: { 
				    600: {
				      slidesPerView: 2,
				      spaceBetween: 10
				    }
				}
			})   



			var h=$('.problem_l ul li .ti').outerHeight(true)*$('.problem_l ul li').length;
			var con_h=$('.problem_l').height()-$('.problem_l .t').outerHeight(true)-h-40-parseInt($('.problem_l .con').css('padding-bottom'));
			$('.problem_l ul li .con').css('max-height',con_h);
			

			$(window).resize(function(){
				h=$('.problem_l ul li .ti').outerHeight(true)*$('.problem_l ul li').length;
				con_h=$('.problem_l').height()-$('.problem_l .t').outerHeight(true)-h-40-parseInt($('.problem_l .con').css('padding-bottom'));
				$('.problem_l ul li .con').css('max-height',con_h);
			})
			$('.problem_l ul li .con').mCustomScrollbar({

			})


			$('.problem_l ul li .ti').click(function(){
				if($(this).parents('li').hasClass('active')){
					$(this).parents('li').removeClass('active');
					$(this).siblings('.con').slideUp();
				}else{
					$('.problem_l ul li').removeClass('active');
					$(this).parents('li').addClass('active');
					$('.problem_l ul li .con').slideUp();
					$(this).siblings('.con').slideDown(function(){
						$(this).mCustomScrollbar('update');
					});
				}
			})

			$('.box ul li .pic').height(Math.floor($('.box ul li .pic').width()*(235/408)));
			$(window).resize(function(){
				$('.box ul li .pic').height(Math.floor($('.box ul li .pic').width()*(235/408)));
			})
		})
	</script>
</body>
</html>
